<?php
    use User\Model\MeetingModel;
?>
<div class="row">
    <div class="col-lg-12">
        <section class="panel">
            <header class="panel-heading">
                活动详情
            </header>
            <div class="panel-body">
                <form class="form-horizontal" method="post"
                      action="<?php if($type=='add'){echo '/User/Lpic/lpicAdd';}
                      else{echo '/User/Lpic/lpicUpdate';}?>">
                    <input type="hidden" value="<?php $val = (!empty($lpic)) ?
                            $lpic['id'] : ''; echo $val;?>" name="id" id="id">
                    <div class="form-group">
                        <label class="col-sm-2 col-sm-2 control-label need">活动名称:</label>

                        <div class="col-lg-4">
                            <input type="text" class="form-control" name="name" value="<?php $val=(!empty($lpic)) ?
                            $lpic['name'] : ''; echo $val;?>" id="name">
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 col-sm-2 control-label need">活动开始时间:</label>

                        <div class="col-lg-4">
                            <input class="form-control" id="date-picker1" name="start_date" value="<?php $val=(!empty($lpic) && ($lpic['start_date'] != '0000-00-00 00:00:00')) ?
                            $lpic['start_date'] : ''; echo $val;?>" placeholder="请输入活动开始时间">
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 col-sm-2 control-label need">会议结束时间:</label>

                        <div class="col-lg-4">
                            <input class="form-control" id="date-picker2" name="end_date" value="<?php $val=(!empty($lpic) && ($lpic['end_date'] != '0000-00-00 00:00:00')) ?
                            $lpic['end_date'] : ''; echo $val;?>" placeholder="请输入会议结束时间">
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 col-sm-2 control-label">活动封面图:</label>

                        <div class="col-sm-10">
                            <div >
                                <input type="radio" name="has_head" value="0"
                                       onclick="getHead(this.value)" <?php if(empty($lpic) || empty($lpic['has_head'])){
                                        echo 'checked';
                                       }?>>否
                                <input type="radio" name="has_head"
                                       value="1"
                                       onclick="getHead(this.value)" <?php if(!empty($lpic) && !empty($lpic['has_head'])){
                                        echo 'checked';
                                       }?>>是
                            </div>
                            <div id="head_img_img">
                                <img id="head_img_url" alt="" src="<?php echo $lpic['head_img']?>" style="width: 200px;height: 200px;">
                                <input type="file" id="head_img">
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 col-sm-2 control-label">活动描述显示:</label>

                        <div class="col-sm-10">
                            <div >
                                <input type="radio" name="show_describe" value="0"
                                    onclick="showDescribe(this.value)" <?php if(empty($lpic) || empty($lpic['show_describe'])){
                                echo 'checked';
                                }?>>否
                                <input type="radio" name="show_describe" value="1"
                                    onclick="showDescribe(this.value)" <?php if(!empty($lpic) && !empty($lpic['show_describe'])){
                                echo 'checked';
                                }?>>是
                                <textarea id="describe" style="width:300px;height:200px;" name="describe"><?php echo $lpic['describe']?></textarea>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 col-sm-2 control-label">banner图:</label>

                        <div class="col-sm-10">
                            <img src="<?php
                        if(empty($lpic) || empty($lpic['banner_img'])){
                            echo '';
                        }else{
                            echo $lpic['banner_img'];
                        }
                            ?>" alt="" id="banner_img_url" style="width: 200px;height: 200px;">
                            <input name="banner_img" id="banner_img" type="file">
                            <label class="help-block">建议上传图片尺寸为750*340。</label>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 col-sm-2 control-label need">主题颜色:</label>

                        <div class="col-lg-4">
                            <div class="col-sm-2" id="color-blue" onclick="changeColor('#008DFD')" style="width:30px;height:30px;background-color:#008DFD"></div>
                            <div class="col-sm-2" id="color-orange" onclick="changeColor('#FF824D')" style="width:30px;height:30px;background-color:#FF824D"></div>
                            <div class="col-sm-2" id="color-red" onclick="changeColor('#FF5854')" style="width:30px;height:30px;background-color:#FF5854"></div>
                            <div class="col-sm-2" id="color-green" onclick="changeColor('#2EBE9B')" style="width:30px;height:30px;background-color:#2EBE9B"></div>
                            <input class="form-control" name="color" value="<?php $val=(!empty($lpic)) ?
                        $lpic['color'] : '#008DFD'; echo $val;?>" id="color">
                        </div>
                    </div>
                    <hr>


                    <span>图片设置</span>

                    <div class="form-group">
                        <label class="col-sm-2 col-sm-2 control-label">图片是否审核:</label>

                        <div class="col-sm-10">
                            <div >
                                <input type="radio" name="pic_check" value="0"
                            <?php if(empty($lpic) || empty($lpic['pic_check'])){
                                echo 'checked';
                            }?>>否
                            <input type="radio" name="pic_check" value="1"
                            <?php if(!empty($lpic) && !empty($lpic['pic_check'])){
                                echo 'checked';
                            }?>>是
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 col-sm-2 control-label">图片默认排序(时间轴):</label>

                        <div class="col-sm-10">
                            <div >
                                <input type="radio" name="pic_order" value="0"
                                <?php if(empty($lpic) || empty($lpic['pic_order'])){
                                    echo 'checked';
                                }?>>倒序
                                <input type="radio" name="pic_order" value="1"
                                <?php if(!empty($lpic) && !empty($lpic['pic_order'])){
                                    echo 'checked';
                                }?>>正序
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 col-sm-2 control-label">时间轴分类:</label>

                        <div class="col-sm-10">
                            <div >
                                <input type="radio" name="t_order_type" value="0"
                                <?php if(empty($lpic) || empty($lpic['t_order_type'])){
                                    echo 'checked';
                                }?>>按天
                                <input type="radio" name="t_order_type" value="1"
                                <?php if(!empty($lpic) && !empty($lpic['t_order_type'])){
                                    echo 'checked';
                                }?>>按小时
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 col-sm-2 control-label">图片详情显示:</label>

                        <div class="col-sm-10">
                            <div >
                                <input type="checkbox" name="show_name" <?php echo ($lpic['show_detail'] / 1000) >= 1 ? ' checked' : '';?>>姓名
                                <input type="checkbox" name="show_nickname" <?php echo (($lpic['show_detail'] % 1000) / 100) >= 1 ? ' checked' : '';?>>昵称
                                <input type="checkbox" name="show_time" <?php echo (($lpic['show_detail'] % 100) / 10) >= 1 ? ' checked' : '';?>>上传时间
                                <input type="checkbox" name="show_desc" <?php echo ($lpic['show_detail'] % 10) == 1 ? ' checked' : '';?>>描述
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-lg-offset-2 col-lg-10">
                            <button class="btn btn-primary" type="submit" id="submit">提交</button>
                            <button class="btn btn-default" type="button" onclick="history.back(-1);">取消</button>
                        </div>
                    </div>
                </form>
            </div>
        </section>
    </div>
</div>
<script>
    //--图片处理--
    var head_img_data = '';
    var bannerurl_data = '';
    $(function () {
        var head_img = document.getElementById("head_img");
        head_img.addEventListener('change', readFile, false);

        var banner_img = document.getElementById("banner_img");
        banner_img.addEventListener('change', readFile1, false);
    });
    function readFile() {
        var file = this.files[0];
        if (!/image\/\w+/.test(file.type)) {
            alert("请确保文件为图像类型");
            return false;
        }
        var reader = new FileReader();
        reader.readAsDataURL(file);
        reader.onload = function () {
            $("#head_img_url").attr("src", this.result);
            head_img_data = this.result;
        }
    }

    function readFile1() {
        var file = this.files[0];
        if (!/image\/\w+/.test(file.type)) {
            alert("请确保文件为图像类型");
            return false;
        }
        var reader = new FileReader();
        reader.readAsDataURL(file);
        reader.onload = function () {
            $("#banner_img_url").attr("src", this.result);
            bannerurl_data = this.result;
        }
    }

    //--是否显示封面--
    var has_head = "<?php echo !empty($lpic) ? $lpic['has_head'] : 0?>";
    getHead(has_head);
    function getHead(val) {
        has_head = val;
        if (val == "1") {
            $("#head_img_img").css('display', 'block');
        }else{
            $("#head_img_img").css('display', 'none');
        }
    }

    //--是否显示描述--
    var show_describe = "<?php echo !empty($lpic) ? $lpic['show_describe'] : 0?>";
    showDescribe(show_describe);
    function showDescribe(val) {
        show_describe = val;
        if (val == "1") {
            $("#describe").css('display', 'block');
        }else{
            $("#describe").css('display', 'none');
        }
    }

    //--改变颜色--
    var color = $("#color").val();
    changeColor(color);
    function changeColor(color_now){
        if(color_now == "#FF824D"){
            $("#color-orange").css("border", "2px solid black");
            $("#color-red").css("border", "none");
            $("#color-green").css("border", "none");
            $("#color-blue").css("border", "none");
        }else if(color_now == "#FF5854"){
            $("#color-orange").css("border", "none");
            $("#color-red").css("border", "2px solid black");
            $("#color-green").css("border", "none");
            $("#color-blue").css("border", "none");
        }else if(color_now == "#2EBE9B"){
            $("#color-orange").css("border", "none");
            $("#color-red").css("border", "none");
            $("#color-green").css("border", "2px solid black");
            $("#color-blue").css("border", "none");
        }else if(color_now == "#008DFD"){
            $("#color-orange").css("border", "none");
            $("#color-red").css("border", "none");
            $("#color-green").css("border", "none");
            $("#color-blue").css("border", "2px solid black");
        }else{
            $("#color-orange").css("border", "none");
            $("#color-red").css("border", "none");
            $("#color-green").css("border", "none");
            $("#color-blue").css("border", "none");
        }
        $("#color").val(color_now);
    }

    $("#submit").click(function () {

        var data = $.param({"head_img": head_img_data, "banner_img": bannerurl_data}) + "&" + $("form").serialize();
        var url = $("form").attr("action");
        $.ajax({
            type: 'post',
            dataType: 'json',
            data: data,
            url: url,
            async:false,
            success: function (res) {
                if (res.code == 1) {
                    alert("提交成功");
                    window.location = '/User/Lpic/index';
                } else {
                    alert(res.msg);
                }
            }
        });
        return false;
    });
</script>
<script type="text/javascript" src="/Public/js/laydatenew/laydate.js"></script>
<script type="text/javascript">
    laydate.render({
        elem: '#date-picker1',
        type: 'datetime'
    });
    laydate.render({
        elem: '#date-picker2',
        type: 'datetime'
    });
</script>